
:root{
    /* 主题色 */
    --theme-1: #e6f7ff;
    --theme-2: #bae7ff;
    --theme-6: #1890ff;  /* 主色 */
    --theme-7: #096dd9;

    /* 主文本 */
    --text-primary: #303133;    /* 主要文字 */
    --text-regular: #606266;    /* 常规文字 */
    --text-secondary: #909399;  /* 次要文字 */
    --text-disabled: #C0C4CC;   /* 占位文字 */
    --text-white: #ffffff;                  /* 白色文字 */
    
    /* 边框 */
    --border-1: #ffffff;
    --border-2: #fafafa;
    --border-3: #f5f5f5;
    --border-4: #f0f0f0;
    --border-5: #d9d9d9;
    --border-6: #bfbfbf;
    
    /* 背景 */
    --bg-white: #ffffff;          /* 白色背景 */
    --bg-gray-1: #fafafa;        /* 最浅灰背景 */
    --bg-gray-2: #f5f5f5;        /* 浅灰背景 */
    --bg-gray-3: #f0f0f0;        /* 灰背景 */
    --bg-gray-4: #d9d9d9;        /* 深灰背景 */

/* ---------- 功能色 ---------- */
    /* 成功色 */
    --success-1: #f6ffed;
    --success-2: #d9f7be;
    --success-6: #52c41a;  /* 主色 */
    --success-7: #389e0d;
    
    /* 警告色 */
    --warning-1: #fff7e6;
    --warning-2: #ffe7ba;
    --warning-6: #faad14;  /* 主色 */
    --warning-7: #d48806;
    
    /* 错误色 */
    --error-1: #fff1f0;
    --error-2: #ffccc7;
    --error-6: #ff4d4f;  /* 主色 */
    --error-7: #d9363e;
    
    /* 信息色 */
    --info-1: #e6f7ff;
    --info-2: #bae7ff;
    --info-6: #1890ff;  /* 主色 */
    --info-7: #096dd9;
}

body {
    font-size: 14px;
    color: var(--text-primary);
    line-height: 1.5;
}
/* ---------- 文字颜色 ---------- */
/* 主要文字 */
.text-primary { color: var(--text-primary); }
.text-regular { color: var(--text-regular); }
.text-secondary { color: var(--text-secondary); }
.text-disabled { color: var(--text-disabled); }
.text-white { color: var(--text-white)!important }


/* 功能色文字 */
.text-success { color: var(--success-6); }
.text-warning { color: var(--warning-6); }
.text-error { color: var(--error-6); }
.text-info { color: var(--info-6); }


/* ---------- 背景颜色 ---------- */
/* 基础背景 */
.bg-white { background-color: var(--bg-white); }
.bg-gray-1 { background-color: var(--bg-gray-1); }
.bg-gray-2 { background-color: var(--bg-gray-2); }
.bg-gray-3 { background-color: var(--bg-gray-3); }
.bg-gray-4 { background-color: var(--bg-gray-4); }

/* ---------- 常用组合 ---------- */
.text-main {
    font-size: 14px;
    color: var(--text-primary);
    line-height: 1.5;
}

.text-desc {
    font-size: 12px;
    color: var(--text-secondary);
    line-height: 1.5;
}

.text-title {
    font-size: 16px;
    font-weight: 500;
    color: var(--text-primary);
    line-height: 1.5;
}

.text-subtitle {
    font-size: 14px;
    font-weight: 500;
    color: var(--text-secondary);
    line-height: 1.5;
}

/* 按钮 */
.btn {
    display: inline-block;
    padding: 6px 10px;
    font-size: 12px;
    border-radius: 4px;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    background: #fff;
    border: 1px solid transparent;
    color: var(--text-primary);
    -webkit-appearance: none;
    box-sizing: border-box;
    outline: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}

.btn--primary {
    color: #fff;
    background-color: var(--theme-6);
    border-color: var(--theme-6);
}
